﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="../css/mui.min.css"/>
    <title>骨医快线</title>
    <link href="../css/mui.plus.css" rel="stylesheet" />
    <style>
    	.mui-table-view-chevron .mui-table-view-cell {
    		padding-right: 15px;
    	}
    	span.pat-status1, span.pat-status2 {
		    padding: 0 3px;
    		margin-left: 5px;
		    border: 1px solid #aaa;
		    border-radius: 5px;
		    font-size: 12px;
		    color: #30B497;
		}
		span.pat-status1 {
			border: 1px solid #30B497;
		}
		span.pat-status2 {
			color: #999;
		}
		.mui-table-view:after {
			height: 0;
		}
		.date {
			padding: 0!important;
		}
		.mui-row img {
			width: 98%;
		}
		/*顶栏处理*/
		.mui-bar.mui-bar-nav {
			background: #fff;
			border: none;
		}
		.mui-bar.mui-bar-nav .mui-title {
			font-size: 16px;
			color: #999;
		}
    </style>
</head>
<body>
	<div class="pat-header-mat"></div>
	<header class="mui-bar mui-bar-nav">
		<h1 class="mui-title">骨医快线</h1>
	</header>
    <div class="mui-content mui-scroll-wrapper oe-home" id="refreshContainer">
	  	<div class="mui-scroll">
	        <div class="mui-row" style="padding-top: 10px;">
		        <div class="mui-col-sm-6 mui-col-xs-4">
		            <img src="../images/btn-record-add.png" alt="添加病历" id="btnAddRecord"/>
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-4" >
		            <img src="../images/btn-qrcode.png" id="btn-qrcode" alt="量表库" id="btn-scale"/>
		        </div>
		        <div class="mui-col-sm-6 mui-col-xs-4">
		            <img src="../images/btn-scale.png" alt="量表库" id="btn-scale"/>
		        </div>
		    </div>
	        <div class="oe-title-line">所有病历</div>
	        <ul class="mui-table-view mui-table-view-chevron oe-list1" id="recordList">
	            <!--<li class="mui-table-view-cell">
					<div class="mui-slider-right mui-disabled">
						<a class="mui-btn mui-btn-red">删除</a>
					</div>
					<div class="mui-slider-handle">
						加载中...
					</div>
				</li>-->
				<div class="oe-emp">
					<img src="../images/blank_page/empty-helper@2x.png"/>
				</div>
	        </ul>
	        
			<div style="padding-top: 15px;padding-left: 15px;">
				<p>*欢迎登陆我们的官网<br />http://www.orthexpress.com/</p>
			</div>
	   </div>
    </div>
    
    <script id="tmp-rec" type="text/html">
		{{each data as v i}} 
			<li class="mui-table-view-cell" data-recid="{{v.rec_id}}"
				data-inhos="{{v.rec_status === 'IN_HOS' ? 'true' : 'false'}}">
				<div class="mui-slider-right mui-disabled">
					<a class="mui-btn mui-btn-red">删除</a>
				</div>
		        <div class="mui-slider-handle">
		        	<div class="first-line" style="overflow: hidden;">
			            <span>{{v.rec_name}}</span>
			            <span>{{v.rec_sex}}</span>
			            <span>{{v.rec_age}}</span>
			            <span class="v.rec_status === 'IN_HOS' ? ''"></span>
			            {{if v.rec_status === 'IN_HOS'}}
			            	<span class="pat-status1 mui-pull-right">住院中</span>
			            {{else}}
			            	<span class="pat-status2 mui-pull-right">已出院</span>
			            {{/if}}
			        </div>
			        <div class="second-line">
						{{if v.rec_diagnosis}}
							<span>{{v.rec_diagnosis}}</span>
						{{/if}}		            
			            {{if v.rec_bed_no}} 
			            	<span>{{v.rec_bed_no}}床</span>
			            {{/if}}
			            <span class="date">{{v.rec_ctime}}</span>
			        </div>
		        </div>
		    </li>
		{{/each}}
    </script>

    <script src="../js/mui.min.js"></script>
    <script src="../js/app.js"></script>
    <script src="../js/lib/template.js"></script>
    <script type="text/javascript" charset="utf-8">
        (function ($, doc) {
        	var tmpData = {};
        	var recId, inHos;
        	var recList = document.getElementById("recordList"),
        		btnScale = document.getElementById("btn-scale");
        	 
            //页面初始化，传入相关参数 
            $.init({
				pullRefresh : {
			    container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
			    down: {
			    	contentdown : '下拉可以刷新',
			    	contentover : '释放立即刷新',
			    	contentrefresh : '正在刷新...',
					callback: pullDownRefresh
				},
				up : {
				      height:150,//可选.默认50.触发上拉加载拖动距离
				      auto:false,//可选,默认false.自动上拉加载一次
				      contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
				      callback : pullUpRefresh 
				    }
			  	}
            });
            
            function pullDownRefresh(){
            	refresh();
            	setTimeout(function(){$('#refreshContainer').pullRefresh().endPulldownToRefresh()}, 1000);
            }
            
            function pullUpRefresh(){
            	setTimeout(function(){
            		upRefresh();
//					plus.nativeUI.toast('暂无更多数据');
//          		$('#refreshContainer').pullRefresh().endPullupToRefresh(false)
        		}, 500);
            }
            
            var upNum = 1;
            function upRefresh(){
            	app.net.get('c_med_record/show_list_by_dr_id',{ dr_id: app.storage.getUserId(), page_num: ++upNum, page_size: 10 },function(data){
            		if(data && data.code == 100){
            			if(/空数据/.test(data.msg)){
            				$('#refreshContainer').pullRefresh().endPullupToRefresh(false);
            				return plus.nativeUI.toast('暂无更多数据');;
            			}else {
            				//数据填入模板
            				tmpData  = data;
            				var html = template('tmp-rec', tmpData);
            				recList.innerHTML += html;
            				$('#refreshContainer').pullRefresh().endPullupToRefresh(false);
            			}
            		}
            	});
            }
            
			function refresh(){
				app.net.get('c_med_record/show_list_by_dr_id',{ dr_id: app.storage.getUserId(), page_num: 1, page_size: 10 },function(data){
					tmpData  = data;
    				var html = template('tmp-rec', tmpData);
    				if(html){
    					recList.innerHTML = html;
    				}
				});
			}
			
			refresh();
			
			$('.mui-content').on('tap', '#btn-qrcode', function(){
				$.openWindow({
					url: 'pages/qrcode.html',
					waiting: {
						autoShow: false
					}
				});
			});

            //底层支持准备完毕
            $.plusReady(function () {
                var btnAddRecord = document.querySelector("#btnAddRecord");
                var listCache = null;
                var recordDetailPage = $.preload({
                    "id": 'recordDetail',
                    "url": 'helper/record-detail.html'
                });
                
                btnAddRecord.addEventListener('tap', function (event) {
                    //$.fire(addRecordPage, 'addRecord', null);
                    $.openWindow({
                        url: "helper/record-add.html",
                        waiting : {
                        	autoShow : false
                        }
                    });
                });
                
                $('#recordList').on('tap', 'li', function(){
                	recId = this.dataset.recid;
                	$.openWindow({
                		url : 'helper/record-detail.html',
                		waiting : {
                			autoShow : false
                		},
                		extras : {
                			recId : recId
                		}
                	});
                });
                
                var btnArray = ['确认', '取消'];
                $('#recordList').on('tap', '.mui-btn',function(){
                	var self = this;
                	var li = self.parentNode.parentNode;
                	recId = li.dataset.recid;
                	inHos = li.dataset.inhos;
                	
                	if(inHos === 'false'){
                		plus.nativeUI.toast('已出院病人无法删除');
                		$.swipeoutClose(li);
                		return;
                	}
                	
                	$.confirm('确认删除该病历？', '骨医快线', btnArray, function(e) {
						if (e.index == 0) {
							li.parentNode.removeChild(li);
							app.net.post('c_med_record/delete', {rec_id : recId}, function(data){
								if(data && data.code == 100){
									plus.nativeUI.toast('删除成功');
								}
							});
						} else {
							setTimeout(function() {
								$.swipeoutClose(li);
							}, 0);
						}
					});
                });
                
                $('.mui-content').on('tap', '#btn-scale', function(){
                	
                	$.openWindow({
                		url: 'scale/home.html',
                		waiting: {
                			autoShow: false
                		}
                	});
                });

				window.addEventListener('start', function(){
					refresh();
				})
				
                
            });
        }(mui, document));
    </script>
</body>
</html>